import { Select, Form, Col } from 'antd';
interface FormItemSelectProps{
    name:string,
    label:string,
    width?:number,
    onSearch?:Function,
    require:boolean,
    options:Object
}

const FormItemSelect = (props:FormItemSelectProps) =>{
    const getElement = (options:Object) => {
        return Object.entries(options).map(item => 
            <Select.Option value={item[0]} key={item[0]}>
                {item[1]}
                </Select.Option>
                )
     }
    
    return (
        <Col style={{margin:"16px 0"}}>
         <Form.Item wrapperCol={{span:5 }} required={props.require} name={props.name} label={props.label}>
            <Select 
            allowClear
            style={{ width: props.width}}
            >
                {getElement(props.options)}
            </Select>
        </Form.Item>
        </Col>
    )
}
FormItemSelect.defaultProps={
    width:150,
    require:false,
}


export default FormItemSelect;
export type {FormItemSelectProps};